/**
 * Created by maiseries on 2018/1/24.
 */
import React from 'react';
import {
    StyleSheet,
    RefreshControl
} from 'react-native';
import Constants from '../config/Constants'

let _self = null;

const REFRESH_DELAY_TIME = 2000;

export default class RefreshControlView extends React.Component{

    static propTypes = {
        type: React.PropTypes.string,
        onRefresh: React.PropTypes.func
    }

    static defaultProps = {
        type: 'dark'
    }

    constructor(prop){
        super(prop);
        _self = this;
        this.state = {
            refreshing: false,
            title: '下拉刷新数据'
        }
    }

    refresh() {
        _self.setState({
            refreshing: true,
        })
        setTimeout(()=>{
            _self.setState({
                title: '正在获取数据'
            })
        },REFRESH_DELAY_TIME/3);
        setTimeout(()=>{
            if(_self.props.onRefresh){
                _self.props.onRefresh();
            }
            _self.setState({
                title: '数据刷新完成'
            })
        },REFRESH_DELAY_TIME*2/3);
        setTimeout(()=>{
            _self.setState({
                refreshing: false,
            })
        },REFRESH_DELAY_TIME);
        setTimeout(()=>{
            _self.setState({
                title: '下拉刷新数据'
            })
        },REFRESH_DELAY_TIME*4/3)
    }

    render(){

        return(
            <RefreshControl
                refreshing={this.state.refreshing}
                onRefresh={()=>this.refresh()}
                tintColor={this.props.type === 'light'?'#e8e8e8':'#666'}
                colors={this.props.type === 'light'?['#e8e8e8']:['#666']}
                title={this.state.title}
                titleColor={this.props.type === 'light'?'#fff':'#666'}
                progressBackgroundColor={layout.MAIN_AUX_COLOR}/>
        )
    }
}
const styles = StyleSheet.create({

});